import QtQuick 2.0
import QtQuick.Controls 2.14
import QtQuick.Layouts 1.0
import QtQml 2.3

Item {
    objectName: "NetSelect"
    width: 800
    height: 600
    visible: true

    ColorAnimation {
        from: "white"
        to: "black"
        duration: 200
    }

    Rectangle{
        color: "#aeaeae"
        anchors.rightMargin: 0
        anchors.bottomMargin: 0
        anchors.topMargin: 0
        anchors.fill: parent
        scale: 1
        transformOrigin: Item.Center

        Column {
            anchors.fill: parent
            spacing: 6
            width: parent.width
            height: parent.height
            RowLayout {
                spacing: 5
                Row{
                    Layout.topMargin: 20
                    Layout.leftMargin: 20
                    Label {
                        id: label6
                        Layout.leftMargin: 20
                        text: qsTr("打开端口: ")
                        Layout.preferredHeight: 40
                        renderType: Text.QtRendering
                        Layout.preferredWidth: 125
                        wrapMode: Text.NoWrap
                        font.pointSize: 20
                    }


                    TextEdit {
                        id: port
                        Layout.leftMargin: 20
                        Layout.topMargin: 20
                        width: 233
                        height: 40
                        text: qsTr("9001")
                        font.italic: false
                        font.bold: true
                        Layout.columnSpan: 2
                        Layout.preferredHeight: 33
                        Layout.preferredWidth: 233
                        selectionColor: "#f0f0f1"
                        cursorVisible: true
                        font.pixelSize: 20
                        color: "white"
                        textMargin: 4
                    }
                    ComboBox {
                        id: conn_type
                        Layout.leftMargin: 20
                        Layout.topMargin: 20
                        width: 143
                        height: 40

                        model:[
                            "client",
                            "server"
                        ]
                    }
                }
            }
            RowLayout{
                spacing: 5
                Row{
                    Layout.topMargin: 20
                    Layout.leftMargin: 20
                    Label {
                        id: label7
                        text: "协议选择:"
                        Layout.leftMargin: 20
                        Layout.topMargin: 20
                        Layout.preferredHeight: 40
                        renderType: Text.QtRendering
                        Layout.preferredWidth: 125
                        wrapMode: Text.NoWrap
                        font.pointSize: 20
                    }
                    ComboBox {
                        id: proto_combox
                        Layout.leftMargin: 20
                        Layout.topMargin: 20
                        width: 143
                        height: 40

                        model:[
                            "udp",
                            "tcp"
                        ]
                    }
                    RadioButton {
                        id: radioSelectWebsocket
                        Layout.leftMargin: 20
                        Layout.topMargin: 20
                        width: 138
                        height: 41
                        text: qsTr("websocket")
                        checkable:  true
                        checked: true
                        onClicked:{
                            if(radioSelectWebsocket.checked == true){
                                radioSelectWebsocket.checked = false
                                radioSelectWebsocket.checkable  = false
                            }else{
                                radioSelectWebsocket.checked = true
                                radioSelectWebsocket.checkable  = true
                            }
                        }
                    }
                }
            }

            RowLayout{
                spacing: 5

                Label {
                    id: label8
                    Layout.leftMargin: 20
                    Layout.topMargin: 20
                    text: qsTr("地址: ")
                    Layout.preferredHeight: 40
                    renderType: Text.QtRendering
                    wrapMode: Text.NoWrap
                    font.pointSize: 20
                }
                TextEdit {
                    id: hostEdit
                    Layout.leftMargin: 20
                    Layout.topMargin: 20
                    width: 233
                    height: 40
                    text: qsTr("127.0.0.1")
                    font.italic: false
                    font.bold: true
                    Layout.columnSpan: 2
                    Layout.preferredHeight: 33
                    Layout.preferredWidth: 233
                    selectionColor: "#f0f0f1"
                    cursorVisible: true
                    font.pixelSize: 20
                }
            }
            RowLayout{
                spacing: 5
                Button {
                    id: button_network
                    Layout.leftMargin: 20
                    Layout.topMargin: 20
                    width: 128
                    height: 52
                    text: qsTr("打开网络")

                    onClicked:  {
                        if(button_network.text == "打开网络"){
                            console.log(proto_combox.currentText)
                            let type_network = -1
                            if(proto_combox.currentText === "udp" ){
                                type_network = 0
                                button_network.text = "关闭连接"

                            }
                            if(proto_combox.currentText === "tcp" && (conn_type.currentText === "server")){
                                type_network = 1
                                button_network.text = "正在监听"
                                button_close.visible = true
                            }
                            if(proto_combox.currentText === "tcp" &&  (conn_type.currentText === "client")){
                                type_network = 3
                                button_network.text = "正在连接"
                            }

                            console.log(hostEdit.text,
                                        port.text,
                                        radioSelectWebsocket.checked,
                                        type_network)

                            let ret = DataWrap.openNetwork(hostEdit.text,
                                                           Number(port.text),
                                                           radioSelectWebsocket.checked,
                                                           type_network)


                        }else if ((button_network.text === "关闭连接") && (proto_combox.currentText === "udp"))
                        {
                            console.log("dfdfads")
                            DataWrap.closeNetwork("");
                            button_network.text = "打开网络"
                        }
                        else if ((button_network.text === "关闭连接") && (proto_combox.currentText === "tcp"))
                        {
                            console.log("dfdfads")
                            DataWrap.closeNetwork("");
                            button_network.text = "打开网络"
                        }
                    }
                }
                Button {
                    id: button_close
                    visible: false
                    Layout.leftMargin: 20
                    Layout.topMargin: 20
                    width: 128
                    height: 52
                    text: qsTr("停止监听")

                    onClicked:  {
                        if(button_network.text == "正在监听"){
                            button_close.visible = false
                            DataWrap.closeNetwork("tcpserver");
                            button_network.text = "打开网络"
                        }
                    }
                }
            }
            ToolTip {
                id: tip
                text: qsTr("")
                visible: false
                font.pixelSize: 25
                width: 220

                contentItem: Text {
                    id : tip_item
                    text: tip.text
                    font: tip.font
                    color: "#21be2b"
                }

                background: Rectangle {
                    id: tip_background
                    border.color: "#21be2b"
                    width: 220
                    height: 40
                }
                function success(str){
                    tip_item.color =  "#21be2b"
                    tip.text = str
                    tip.visible = true
                }
                function fail(str){
                    tip_item.color =  "#ff0000"
                    tip.text = str
                    tip.visible = true
                }
                delay: 100
                timeout: 1000
            }
        }
    }

    Connections {
        target: DataWrap
        onSendToQml: {
            button_network.text = "关闭连接"
            tip.success("网络连接成功")
        }
    }
    Connections {
        target: DataWrap
        onDisConnected: {
            button_network.text = "打开网络"
            tip.success("网络连接失败")
        }
    }
}
